<template>
	<view class="messagelist" style="height: 100%;
	display: flex;
	flex-direction: column;
	background-color: #009EF0;
	background: url('../../../static/image/background1.png') no-repeat center;
	background-size: cover;">
		<view class="title">
			<text>消息列表</text>
		</view>
		<scroll-view class="scroll-Y" scroll-y="true" style="height: 94%;">
			<view class="main" v-for="item in messagelist" :key="item.id" @click="tomessagedetail(item)">
				<view class="isread" v-if="!item.status"></view>
				<view class="content">
					<view class="region_time">
						<text style="color:#009FF1" class="category">{{item.title}}</text>
						<text class="time">{{item.sendDate}}</text>
					</view>
					<view style="display: flex;justify-content: space-between;align-items: center;">
						<text class="warninglevel">{{item.departmentName}}</text>
						<text style="color: #fff;">{{item.status=="1"?"已读":"!未读"}}</text>
					</view>
					<text class="warningreason">{{item.content}}</text>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		ajax
	} from '../../../api/apis';
	export default {
		data() {
			return {
				messagelist: [],
				parmas: {
					page: 1,
					size: 20,
					userId: ""
				},
				status:""
			}
		},
		onShow() {
			let _this = this;
			uni.getStorage({
				key: "userid",
				success(res) {
					console.log("当前用户ID：", res.data);
					ajax({
						url: "/push/getMessage?page=1&size=20&userId=" + res.data,
						method: "GET",
						success(res) {
							console.log(res);
							_this.messagelist = res.data.data.list;
						}
					});
				}
			});
		},
		onPullDownRefresh() {
			let _this=this
			uni.getStorage({
				key: "userid",
				success(res) {
					console.log("当前用户ID：", res.data);
					ajax({
						url: "/push/getMessage?page=1&size=20&userId=" + res.data,
						method: "GET",
						success(res) {
							console.log(res);
							_this.messagelist = res.data.data.list;
						}
					});
				}
			});
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			tomessagedetail(item) {
				if (!item.status) {
					ajax({
						url: "/push/isRead?id=" + item.id,
						method: "GET"
					});
				}
				item.status = 1;
				uni.navigateTo({
					url: `../messagedetail/messagedetail?departmentName=${item.departmentName}&sendDate=${item.sendDate}&userName=${item.userName}&title=${item.title}&content=${item.content}`
				});
			}
		}
	}
</script>

<style scoped>
	uni-page-body {
		height: 100%;
	}

	.messagelist {
		height: 100%;
		/* background-color:#f9f9f9; */
	}

	.title {
		font-size: 16px;
		padding: 15px;
		color: #fff;
		text-align: center;
		background: url("../../../static/image/navbg.png") no-repeat center;
	}


	.main {
		display: flex;
		flex-direction: column;
		font-size: 12px;
		border: 1px solid #e0e0e0;
		border-radius: 10px;
		margin: 10px 15px;
		/* margin: 17px 0; */
		padding: 17px 24px;
	}

	.region_time {
		display: flex;
		justify-content: space-between;
		/* font-size: 12px; */
	}

	.warninglevel {
		display: flex;
		margin: 12px 0;
	}

	.warningreason,
	.warninglevel,
	.time {
		color: #F1F1F1;
	}
</style>
